<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>Examples | Butano Docs</title>
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,600,600i%7CSource+Code+Pro:400,400i,600" />
  <link rel="stylesheet" href="m-dark+documentation.compiled.css" />
  <link rel="icon" href="favicon-dark.png" type="image/png" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta name="theme-color" content="#22272e" />
</head>
<body>
<header><nav id="navigation">
  <div class="m-container">
    <div class="m-row">
      <span id="m-navbar-brand" class="m-col-t-8 m-col-m-none m-left-m">
        <a href="https://github.com/GValiente/butano">Butano</a> <span class="m-breadcrumb">|</span> <a href="index.html" class="m-thin">Docs</a>
      </span>
      <div class="m-col-t-4 m-hide-m m-text-right m-nopadr">
        <a href="#search" class="m-doc-search-icon" title="Search" onclick="return showSearch()"><svg style="height: 0.9rem;" viewBox="0 0 16 16">
          <path id="m-doc-search-icon-path" d="m6 0c-3.31 0-6 2.69-6 6 0 3.31 2.69 6 6 6 1.49 0 2.85-0.541 3.89-1.44-0.0164 0.338 0.147 0.759 0.5 1.15l3.22 3.79c0.552 0.614 1.45 0.665 2 0.115 0.55-0.55 0.499-1.45-0.115-2l-3.79-3.22c-0.392-0.353-0.812-0.515-1.15-0.5 0.895-1.05 1.44-2.41 1.44-3.89 0-3.31-2.69-6-6-6zm0 1.56a4.44 4.44 0 0 1 4.44 4.44 4.44 4.44 0 0 1-4.44 4.44 4.44 4.44 0 0 1-4.44-4.44 4.44 4.44 0 0 1 4.44-4.44z"/>
        </svg></a>
        <a id="m-navbar-show" href="#navigation" title="Show navigation"></a>
        <a id="m-navbar-hide" href="#" title="Hide navigation"></a>
      </div>
      <div id="m-navbar-collapse" class="m-col-t-12 m-show-m m-col-m-none m-right-m">
        <div class="m-row">
          <ol class="m-col-t-6 m-col-m-none">
            <li><a href="pages.html">Pages</a></li>
            <li><a href="modules.html">Modules</a></li>
          </ol>
          <ol class="m-col-t-6 m-col-m-none" start="3">
            <li><a href="namespaces.html">Namespaces</a></li>
            <li><a href="annotated.html">Classes</a></li>
            <li><a href="files.html">Files</a></li>
            <li class="m-show-m"><a href="#search" class="m-doc-search-icon" title="Search" onclick="return showSearch()"><svg style="height: 0.9rem;" viewBox="0 0 16 16">
              <use href="#m-doc-search-icon-path" />
            </svg></a></li>
          </ol>
        </div>
      </div>
    </div>
  </div>
</nav></header>
<main><article>
  <div class="m-container m-container-inflatable">
    <div class="m-row">
      <div class="m-col-l-10 m-push-l-1">
        <h1>
          Examples
        </h1>
<p>Learn by example to get quickly up to speed.</p><p>The examples assume that you have at least basic knowledge about:</p><ul><li>Modern C++ (Butano is based on modern C++ concepts like shared ownership, RAII, standard containers...).</li><li>Old school 2D graphics (what are sprites, backgrounds, color palettes...).</li><li>Basics of retro game development (at least to know that floating point usage is a no-no and things like that).</li></ul><p>Deep knowledge of GBA hardware is not required, as Butano wraps most of the functionality in its own classes.</p><p>As always, to understand how the little machine works, <a href="https://gbadev.net/tonc/">Tonc</a> and <a href="http://problemkaputt.de/gbatek.htm">GBATEK</a> are your friends.</p><p>Butano brings multiple examples of most aspects of the engine in <code>/path/to/butano/examples/</code>. Each example project contains multiple mini examples showcasing how easy is to work with Butano.</p><p>The included example projects are the following:</p><table class="m-table"><tbody><tr><td><p><a href="group__affine__bg.html" class="m-doc">Affine backgrounds</a></p><img class="m-image" src="examples_affine_bgs.png" alt="Image" /><p>Demonstrates usage of backgrounds with affine transformations.</p></td><td><p><a href="group__audio.html" class="m-doc">Audio</a></p><img class="m-image" src="examples_audio.png" alt="Image" /><p>Shows how to play Direct Sound music and sound effects with Butano.</p></td><td><p><strong>DMG audio</strong></p><img class="m-image" src="examples_dmg_audio.png" alt="Image" /><p>Simple DMG music playback example.</p></td></tr><tr><td><p><strong>Audio player</strong></p><img class="m-image" src="examples_audio_player.png" alt="Image" /><p>Basic audio player example.</p></td><td><p><a href="group__blending.html" class="m-doc">Blending</a></p><img class="m-image" src="examples_blending.png" alt="Image" /><p>Demonstrates usage of transparency, intensity and fade blending.</p></td><td><p><a href="group__camera.html" class="m-doc">Cameras</a></p><img class="m-image" src="examples_cameras.png" alt="Image" /><p>Shows how a camera affects the displayed elements.</p></td></tr><tr><td><p><a href="group__core.html" class="m-doc">Core</a></p><img class="m-image" src="examples_core.png" alt="Image" /><p>Shows how to sleep and reset the GBA among other things.</p></td><td><p><a href="group__date__time.html" class="m-doc">Date and time</a></p><img class="m-image" src="examples_date_time.png" alt="Image" /><p>Real time clock (RTC) showcase (if your cart has one).</p></td><td><p><strong>Dynamic affine background</strong></p><img class="m-image" src="examples_dynamic_affine_bg.png" alt="Image" /><p>Basic dynamic affine background example.</p></td></tr><tr><td><p><strong>Dynamic regular background</strong></p><img class="m-image" src="examples_dynamic_regular_bg.png" alt="Image" /><p>Basic dynamic regular background example.</p></td><td><p><strong>External tool</strong></p><img class="m-image" src="examples_external_tool.png" alt="Image" /><p>Shows how to call an external tool from the project&#x27;s <code>Makefile</code>.</p></td><td><p><a href="group__green__swap.html" class="m-doc">Green swap</a></p><img class="m-image" src="examples_green_swap.png" alt="Image" /><p>See how it looks this undocumented graphic effect.</p></td></tr><tr><td><p><strong>HDMA palette</strong></p><img class="m-image" src="examples_hdma_palette.png" alt="Image" /><p>In this example, the background palette is updated with HDMA.</p></td><td><p><a href="group__keypad.html" class="m-doc">Keypad</a></p><img class="m-image" src="examples_keypad.png" alt="Image" /><p>Simple keypad status demo.</p></td><td><p><a href="group__link.html" class="m-doc">Link communication</a></p><img class="m-image" src="examples_link.png" alt="Image" /><p>Multiplayer communication through a link cable.</p></td></tr><tr><td><p><a href="group__log.html" class="m-doc">Logging</a></p><img class="m-image" src="examples_log.png" alt="Image" /><p>Integration of emulator logging into Butano.</p></td><td><p><strong>Map collision</strong></p><img class="m-image" src="examples_map_collision.png" alt="Image" /><p>Sprite against map collision example.</p></td><td><p><strong>Mode 7</strong></p><img class="m-image" src="examples_mode_7.png" alt="Image" /><p>Basic SNES mode 7 like background example.</p></td></tr><tr><td><p><a href="group__mosaic.html" class="m-doc">Mosaic</a></p><img class="m-image" src="examples_mosaic.png" alt="Image" /><p>Sprites and backgrounds mosaic effects.</p></td><td><p><a href="group__palette.html" class="m-doc">Color palettes</a></p><img class="m-image" src="examples_palettes.png" alt="Image" /><p>Showcases multiple color palette effects.</p></td><td><p><strong>Flat polygons</strong></p><img class="m-image" src="examples_polygons.png" alt="Image" /><p>Showcases flat polygons rendering with sprites.</p></td></tr><tr><td><p><a href="group__profiler.html" class="m-doc">Profiler</a></p><img class="m-image" src="examples_profiler.png" alt="Image" /><p>Basic code blocks profiling.</p></td><td><p><a href="group__regular__bg.html" class="m-doc">Regular backgrounds</a></p><img class="m-image" src="examples_regular_bgs.png" alt="Image" /><p>Shows how to use regular backgrounds with Butano.</p></td><td><p><a href="group__random.html" class="m-doc">Random</a></p><img class="m-image" src="examples_random.png" alt="Image" /><p>Simple random number generation example.</p></td></tr><tr><td><p><a href="group__rumble.html" class="m-doc">Rumble</a></p><img class="m-image" src="examples_rumble.png" alt="Image" /><p>Vibration showcase (if your cart supports it).</p></td><td><p><a href="group__affine__mat.html" class="m-doc">Sprite affine matrices</a></p><img class="m-image" src="examples_sprite_affine_mats.png" alt="Image" /><p>Demonstrates usage of one affine matrix for multiple sprites.</p></td><td><p><a href="group__sprite.html" class="m-doc">Sprites</a></p><img class="m-image" src="examples_sprites.png" alt="Image" /><p>Simple sprites examples.</p></td></tr><tr><td><p><a href="group__sram.html" class="m-doc">Game Pak SRAM</a></p><img class="m-image" src="examples_sram.png" alt="Image" /><p>SRAM reads and writes with Butano.</p></td><td><p><a href="group__text.html" class="m-doc">Text</a></p><img class="m-image" src="examples_text.png" alt="Image" /><p>Showcase of Butano sprite text rendering.</p></td><td><p><strong>Textured polygons</strong></p><img class="m-image" src="examples_texture_polygons.png" alt="Image" /><p>Showcases textured polygons rendering with sprites.</p></td></tr><tr><td><p><a href="group__timer.html" class="m-doc">Timers</a></p><img class="m-image" src="examples_timer.png" alt="Image" /><p>Simple timer example.</p></td><td><p><a href="group__window.html" class="m-doc">Windows</a></p><img class="m-image" src="examples_windows.png" alt="Image" /><p>Demonstrates usage of rectangle and sprite windows.</p></td><td><p><strong>World map</strong></p><img class="m-image" src="examples_world_map.png" alt="Image" /><p>Showcase of a 4096x4096 world map with a perspective effect.</p></td></tr></tbody></table>
      </div>
    </div>
  </div>
</article></main>
<div class="m-doc-search" id="search">
  <a href="#!" onclick="return hideSearch()"></a>
  <div class="m-container">
    <div class="m-row">
      <div class="m-col-m-8 m-push-m-2">
        <div class="m-doc-search-header m-text m-small">
          <div><span class="m-label m-default">Tab</span> / <span class="m-label m-default">T</span> to search, <span class="m-label m-default">Esc</span> to close</div>
          <div id="search-symbolcount">&hellip;</div>
        </div>
        <div class="m-doc-search-content">
          <form>
            <input type="search" name="q" id="search-input" placeholder="Loading &hellip;" disabled="disabled" autofocus="autofocus" autocomplete="off" spellcheck="false" />
          </form>
          <noscript class="m-text m-danger m-text-center">Unlike everything else in the docs, the search functionality <em>requires</em> JavaScript.</noscript>
          <div id="search-help" class="m-text m-dim m-text-center">
            <p class="m-noindent">Search for symbols, directories, files, pages or
            modules. You can omit any prefix from the symbol or file path; adding a
            <code>:</code> or <code>/</code> suffix lists all members of given symbol or
            directory.</p>
            <p class="m-noindent">Use <span class="m-label m-dim">&darr;</span>
            / <span class="m-label m-dim">&uarr;</span> to navigate through the list,
            <span class="m-label m-dim">Enter</span> to go.
            <span class="m-label m-dim">Tab</span> autocompletes common prefix, you can
            copy a link to the result using <span class="m-label m-dim">⌘</span>
            <span class="m-label m-dim">L</span> while <span class="m-label m-dim">⌘</span>
            <span class="m-label m-dim">M</span> produces a Markdown link.</p>
          </div>
          <div id="search-notfound" class="m-text m-warning m-text-center">Sorry, nothing was found.</div>
          <ul id="search-results"></ul>
        </div>
      </div>
    </div>
  </div>
</div>
<script src="search-v2.js"></script>
<script src="searchdata-v2.js" async="async"></script>
<footer><nav>
  <div class="m-container">
    <div class="m-row">
      <div class="m-col-l-10 m-push-l-1">
        <p>Butano Docs. Created with <a href="https://doxygen.org/">Doxygen</a> 1.14.0 and <a href="https://mcss.mosra.cz/">m.css</a>.</p>
      </div>
    </div>
  </div>
</nav></footer>
</body>
</html>
